<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <title>layout 管理系统大布局 - Layui</title>
  <!--Layui的css-->
  <link rel="stylesheet"
        th:href="@{/libs/layui/css/layui.css}"
        media="all">
<style>
  .layui-table-view .layui-table td, .layui-table-view .layui-table th {
    padding: 14px 0;
    border-top: none;
    border-left: none;
  }
</style>

</head>
<body>
<div class="layui-layout layui-layout-admin">
  <div class="layui-header">
    <div class="layui-logo layui-hide-xs layui-bg-black">layout demo</div>
    <!-- 头部区域（可配合layui 已有的水平导航） -->
    <ul class="layui-nav layui-layout-left">
      <!-- 移动端显示 -->
      <li class="layui-nav-item layui-show-xs-inline-block layui-hide-sm" lay-header-event="menuLeft">
        <i class="layui-icon layui-icon-spread-left"></i>
      </li>

      <li class="layui-nav-item layui-hide-xs"><a href="">nav 1</a></li>
      <li class="layui-nav-item layui-hide-xs"><a href="">nav 2</a></li>
      <li class="layui-nav-item layui-hide-xs"><a href="">nav 3</a></li>
      <li class="layui-nav-item">
        <a href="javascript:;">nav groups</a>
        <dl class="layui-nav-child">
          <dd><a href="">menu 11</a></dd>
          <dd><a href="">menu 22</a></dd>
          <dd><a href="">menu 33</a></dd>
        </dl>
      </li>
    </ul>
    <ul class="layui-nav layui-layout-right">
      <li class="layui-nav-item layui-hide layui-show-md-inline-block">
        <a href="javascript:;">
          <img src="//tva1.sinaimg.cn/crop.0.0.118.118.180/5db11ff4gw1e77d3nqrv8j203b03cweg.jpg" class="layui-nav-img">
          tester
        </a>
        <dl class="layui-nav-child">
          <dd><a href="">Your Profile</a></dd>
          <dd><a href="">Settings</a></dd>
          <dd><a href="">Sign out</a></dd>
        </dl>
      </li>
      <li class="layui-nav-item" lay-header-event="menuRight" lay-unselect>
        <a href="javascript:;">
          <i class="layui-icon layui-icon-more-vertical"></i>
        </a>
      </li>
    </ul>
  </div>

  <div class="layui-side layui-bg-black">
    <div class="layui-side-scroll">
      <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
      <ul class="layui-nav layui-nav-tree" lay-filter="test">
        <li class="layui-nav-item layui-nav-itemed">
          <a class="" href="javascript:;">menu group 1</a>
          <dl class="layui-nav-child">
            <dd><a th:href="@{w}">学生管理</a></dd>
            <dd><a th:href="@{wcl}">教室管理</a></dd>
            <dd><a th:href="@{wc}">班级管理</a></dd>
            <dd><a th:href="@{wdor}">宿舍管理</a></dd>
          </dl>
        </li>
        <li class="layui-nav-item">
          <a href="javascript:;">教室管理</a>
          <dl class="layui-nav-child">
            <dd><a th:href="@{wcl}">教室管理</a></dd>
            <!--            <dd><a href="javascript:;">list 2</a></dd>
                        <dd><a href="">超链接</a></dd>-->
          </dl>
        </li>
        <li class="layui-nav-item">
          <a href="javascript:;">班级管理</a>
          <dl class="layui-nav-child">
            <dd><a th:href="@{wc}">班级管理</a></dd>
            <!--            <dd><a href="javascript:;">list 2</a></dd>
                        <dd><a href="">超链接</a></dd>-->
          </dl>
        </li>
        <li class="layui-nav-item">
          <a href="javascript:;">宿舍管理</a>
          <dl class="layui-nav-child">
            <dd><a th:href="@{wdor}">宿舍管理</a></dd>
            <!--            <dd><a href="javascript:;">list 2</a></dd>
                        <dd><a href="">超链接</a></dd>-->
          </dl>
        </li>

        <li class="layui-nav-item"><a href="javascript:;">click menu item</a></li>
        <li class="layui-nav-item"><a href="">the links</a></li>
      </ul>
    </div>
  </div>

  <div class="layui-body">
    <!-- 内容主体区域 -->
    <!--模糊查询-->
    <div style="font-size: 15px">
      <form id="dataFrm" method="post" class="layui-form  layui-form-pane" lay-filter="dataFrm">

        <div class="layui-form-item" style="width: 275px;float: left;margin: 21px 0px 0px 0px">
          <label class="layui-form-label">班级名称：</label>
          <div class="layui-input-block">
            <input type="text" name="gradeName"
                     autocomplete="off" placeholder="请输入班级名称" class="layui-input">
          </div>
        </div>

        <div class="layui-form-item"  style="width: 275px;float: left;margin: -40px 0px 21px 335px" >

            <label class="layui-form-label">班主任：</label>
            <div class="layui-input-block">
              <input type="tel"  name="classTeacherName"
                        autocomplete="off" placeholder="请输入班主任" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item" style="width: 275px;float: left;margin: -59px -28px -29px 700px" >

            <label class="layui-form-label">讲师：</label>
            <div class="layui-input-block">
              <input type="tel" name="lecturerName"
                        autocomplete="off" placeholder="请输入讲师" class="layui-input">
            </div>
        </div>


        <div class="layui-form-item" style="margin: 21px 0px 0px 0px;float: left;" >
          <label class="layui-form-label">班主任：</label>
          <div class="layui-input-block" style="width: 175px;">
            <select name="classTeacherId" lay-filter="classTeacherId">
              <option value="">请选择</option>
              <!--                    <option value="1">第一号楼</option>-->
              <!--                    <option value="2">第二号楼</option>-->
              <!--                    <option value="3">第三号楼</option>-->
              <!--                    <option value="4">第四号楼</option>-->
            </select>
          </div>
        </div>

        <div class="layui-form-item" style="margin: -40px 0px 31px 335px;float: left;">
          <label class="layui-form-label">讲师：</label>
          <div class="layui-input-block" style="width: 175px;">
            <select name="lecturerId" lay-filter="lecturerId">
              <option value="">请选择</option>
              <!--                    <option value="1">第一楼层</option>-->
              <!--                    <option value="2">第二楼层</option>-->
              <!--                    <option value="3">第三楼层</option>-->
              <!--                    <option value="4">第四楼层</option>-->
            </select>
          </div>
        </div>

        <!--查询按钮-->
        <div class="layui-btn-container"  style="float: left; margin: 0px 0px 0px 0px;">
          <button type="button" class="layui-btn layui-btn-lg layui-btn-normal"
                  lay-submit lay-filter="doSearch"
                  style="margin: -15px 0px -5px 250px">
            <i class="layui-icon layui-icon-search"></i>查询</button>
          <button type="reset" class="layui-btn layui-btn-lg layui-btn-warm"
                  style="margin: -15px 0px -5px 250px">
            <i class="layui-icon layui-icon-chat"></i>重置</button>
          <!--
                  <button type="button" onclick="findStudentInfo()" class="layui-btn layui-btn-normal">查询</button>
          -->
        </div>
      </form>
    </div>

    <!-- 班级数据表格开始 -->
    <div style="float: left;width: 1100px;.layui-table-cell{height:45px}" >
      <!-- 表格 -->
      <table class="layui-hide" id="cTable" lay-filter="cTable" style="height:150px;.layui-table-cell{height:45px}" ></table>

      <!-- 头部工具栏 -->
      <script type="text/html" id="cToolbar">
        <div class="layui-btn-container">

          <button class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon layui-icon-add-circle"></i>添加账单</button>
          <button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="batchDelete" > <i class="layui-icon layui-icon-delete"></i>批量删除</button>

          <button class="layui-btn layui-btn-sm" >获取选中行数据</button>
          <button class="layui-btn layui-btn-sm" >获取选中数目</button>
          <button class="layui-btn layui-btn-sm" >验证是否全选</button>
        </div>
      </script>

      <!-- 行工具栏 -->
      <script type="text/html" id="cbarDemo">
        <button type="button" class="layui-btn layui-btn-normal layui-btn-radius" lay-event="details"><i class="layui-icon layui-icon-dialogue"></i>   详情</button>
        <button type="button" class="layui-btn layui-btn-normal layui-btn-radius" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>   编辑</button>
        <button type="button" class="layui-btn layui-btn-warm layui-btn-radius" lay-event="delete" ><i class="layui-icon layui-icon-delete"></i>删除</button>
      </script>

    </div>


<!--
      <div style="padding: 15px;">内容主体区域。记得修改 layui.css 和 js 的路径</div>
-->
  </div>

  <div class="layui-footer">
    <!-- 底部固定区域 -->
    底部固定区域
  </div>
</div>
<!--   Layui的js-->
<script type="text/javascript"
        th:src="@{/libs/layui/layui.js}"
        charset="utf-8"></script><script>
  //JS
  layui.use(['element', 'layer', 'util'], function(){
    var element = layui.element
            ,layer = layui.layer
            ,util = layui.util
            ,$ = layui.$;

    //头部事件
    util.event('lay-header-event', {
      //左侧菜单事件
      menuLeft: function(othis){
        layer.msg('展开左侧菜单的操作', {icon: 0});
      }
      ,menuRight: function(){
        layer.open({
          type: 1
          ,content: '<div style="padding: 15px;">处理右侧面板的操作</div>'
          ,area: ['260px', '100%']
          ,offset: 'rt' //右上角
          ,anim: 5
          ,shadeClose: true
        });
      }
    });

  });
</script>

<!-- 添加和修改班级的弹出层开始 -->
<div id="addOrUpdateBillDiv" style="display: none;margin: 10px;">
  <form id="dataFrm1" method="post" class="layui-form layui-form-pane " lay-filter="dataFrm1">
    <!-- 隐藏域，保存当前账单的ID -->
    <input type="hidden" name="pkId" id="pkId">

    <div class="layui-form-item">
      <label class="layui-form-label">班级名称：</label>
      <div class="layui-input-block">
        <input type="text" name="gradeName"   placeholder="请输入班级名称" autocomplete="off" class="layui-input">
      </div>
    </div>

    <div class="layui-form-item">
      <label class="layui-form-label">学生数量：</label>
      <div class="layui-input-block">
        <input type="text" name="studentsNumber"  placeholder="请输入学生数量" autocomplete="off" class="layui-input">
      </div>
    </div>

    <div class="layui-form-item" style="margin: 21px 0px 0px 0px;float: left;" >
      <label class="layui-form-label">班主任：</label>
      <div class="layui-input-block" style="width: 175px;">
        <select name="classTeacherId" id="classTeacherId" lay-filter="classTeacherId">
          <option value="">请选择</option>
          <!--                    <option value="1">第一号楼</option>-->
          <!--                    <option value="2">第二号楼</option>-->
          <!--                    <option value="3">第三号楼</option>-->
          <!--                    <option value="4">第四号楼</option>-->
        </select>
      </div>
    </div>

    <div class="layui-form-item" style="margin: -40px 0px 31px 335px;float: left;">
      <label class="layui-form-label">讲师：</label>
      <div class="layui-input-block" style="width: 175px;">
        <select name="lecturerId" id="lecturerId" lay-filter="lecturerId">
          <option value="">请选择</option>
          <!--                    <option value="1">第一楼层</option>-->
          <!--                    <option value="2">第二楼层</option>-->
          <!--                    <option value="3">第三楼层</option>-->
          <!--                    <option value="4">第四楼层</option>-->
        </select>
      </div>
    </div>

<!--    <div class="layui-form-item">-->
<!--      <label class="layui-form-label">班主任：</label>-->
<!--      <div class="layui-input-block">-->
<!--        <input type="text" name="classTeacherName"  placeholder="请输入班主任名称" autocomplete="off" class="layui-input">-->
<!--      </div>-->
<!--    </div>-->

<!--    <div class="layui-form-item">-->
<!--      <label class="layui-form-label">讲师：</label>-->
<!--      <div class="layui-input-block">-->
<!--        <input type="text" name="lecturerName"  placeholder="请输入讲师名称" autocomplete="off" class="layui-input">-->
<!--      </div>-->
<!--    </div>-->

    <div class="layui-form-item">
      <label class="layui-form-label">所在教室ID：</label>
      <div class="layui-input-block">
        <input type="text" name="classroomClassroomId"  placeholder="请输入所在教室ID" autocomplete="off" class="layui-input">
      </div>
    </div>



    <div class="layui-form-item" style="text-align: center;">
      <button type="button" class="layui-btn" lay-submit lay-filter="doSubmit">确认</button>
      <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    </div>
  </form>
</div>
<!-- 添加和修改班级的弹出层结束-->

<!-- 详情的弹出层结束 -->
<div id="openDetailsWindow" style="display: none;margin: 10px;">
  <form id="dataFrm2" method="post" class="layui-form layui-form-pane " lay-filter="dataFrm2">
    <!-- 隐藏域，保存当前账单的ID -->
    <input type="hidden" name="pkId">

    <div class="layui-form-item">
      <label class="layui-form-label">班级名称：</label>
      <div class="layui-input-block">
        <input type="text" name="gradeName"  placeholder="请输入班级名称" autocomplete="off" class="layui-input">
      </div>
    </div>

    <div class="layui-form-item">
      <label class="layui-form-label">学生数量：</label>
      <div class="layui-input-block">
        <input type="text" name="studentsNumber"  placeholder="请输入学生数量" autocomplete="off" class="layui-input">
      </div>
    </div>

    <div class="layui-form-item">
      <label class="layui-form-label">班主任：</label>
      <div class="layui-input-block">
        <input type="text" name="classTeacherName"  placeholder="请输入班主任名称" autocomplete="off" class="layui-input">
      </div>
    </div>

    <div class="layui-form-item">
      <label class="layui-form-label">讲师：</label>
      <div class="layui-input-block">
        <input type="text" name="lecturerName"  placeholder="请输入讲师名称" autocomplete="off" class="layui-input">
      </div>
    </div>

    <div class="layui-form-item">
      <label class="layui-form-label">所在教室ID：</label>
      <div class="layui-input-block">
        <input type="text" name="classroomClassroomId"  placeholder="请输入所在教室ID" autocomplete="off" class="layui-input">
      </div>
    </div>



    <div class="layui-form-item" style="text-align: center;">
      <div class="layui-btn-container">

<!--      <button type="button" class="layui-btn" lay-submit lay-filter="doSubmit">确认</button>-->
<!--      <button type="reset" class="layui-btn layui-btn-primary">重置</button>-->
        <button type="button" class="layui-btn layui-btn-radius layui-btn-normal" id="addstu">
          <i class="layui-icon layui-icon-add-circle"></i>添加学生</button>
          <button type="button" class="layui-btn layui-btn-radius layui-btn-normal" id="gsAll">
          <i class="layui-icon layui-icon-add-circle"></i>本班学生</button>

    </div>
    </div>>
  </form>
</div>
<!-- 详情的弹出层结束-->


<!-- 详情的学生信息弹出层开始 -->
<div id="openAddStuWindow" style="display: none;margin: 10px;">
  <!-- 数据表格开始 -->
  <div>
    <!-- 表格 -->
    <table class="layui-hide" id="studentTable" lay-filter="studentTable" style="height:150px" ></table>

    <!-- 头部工具栏 -->
    <script type="text/html" id="studentToolbar">
      <div class="layui-btn-container">


        <button class="layui-btn layui-btn-sm layui-btn-warm" lay-event="batchStuadd" > <i class="layui-icon layui-icon-add-circle"></i>批量添加</button>


      </div>
    </script>

    <!-- 行工具栏 -->
    <script type="text/html" id="barDemo">

      <button type="button" class="layui-btn layui-btn-normal layui-btn-radius" lay-event="addCStu"><i class="layui-icon layui-icon-add-circle"></i>添加学生</button>
<!--      <button type="button" class="layui-btn layui-btn-warm layui-btn-radius" lay-event="delete" ><i class="layui-icon layui-icon-delete"></i>删除</button>-->
    </script>

  </div>
</div>
<!-- 详情的弹出层结束-->


<!-- 详情的本班学生信息弹出层开始 -->
<div id="opengsWindow" style="display: none;margin: 10px;">

  <!--模糊查询-->
  <div style="font-size: 15px">
    <form id="gsFuzzyQuery" method="post" class="layui-form  layui-form-pane" lay-filter="gsFuzzyQuery">

      <div class="layui-form-item" style="width: 275px;float: left;margin: 21px 0px 0px 0px">
        <label class="layui-form-label">学生姓名：</label>
        <div class="layui-input-block">
          <input type="text"  name="stuName"
                 style="width: 175px;"  autocomplete="off" placeholder="请输入学生姓名" class="layui-input">
        </div>
      </div>
       <div class="layui-form-item" style="width: 275px;float: left;margin: -40px 0px 21px 335px" >
        <label class="layui-form-label">学生ID：</label>
        <div class="layui-input-block">
          <input type="text" name="studentId"
                 style="width: 175px;"  autocomplete="off" placeholder="请输入学生ID" class="layui-input">
        </div>
      </div>

      <!--查询按钮-->
      <div class="layui-btn-container" style="float: left">
        <button type="button" class="layui-btn layui-btn-radius layui-btn-normal" lay-submit lay-filter="doSearch"
                style="float: left; margin: 0px 0px 0px 183px"
        >搜索</button>
        <button type="reset" class="layui-btn layui-btn-radius layui-btn-warm"
                style="float: left; margin: 0 0px 0px 200px"
        >重置</button>
        <!--
                <button type="button" onclick="findStudentInfo()" class="layui-btn layui-btn-normal">查询</button>
        -->
      </div>
    </form>
  </div>

  <!-- 数据表格开始 -->
  <div style="float: left"   >
    <!-- 表格 -->
    <table class="layui-hide" id="gsTable" lay-filter="gsTable" style="height:150px" ></table>

    <!-- 头部工具栏 -->
    <script type="text/html" id="gsToolbar">
      <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="batchDeletesStu" > <i class="layui-icon layui-icon-delete"></i>批量删除</button>
      </div>
    </script>

    <!-- 行工具栏 -->
    <script type="text/html" id="gsDemo">
      <button type="button" class="layui-btn layui-btn-warm layui-btn-radius" lay-event="deleteSstuID" ><i class="layui-icon layui-icon-delete"></i>删除</button>
    </script>

  </div>

</div>
<!-- 详情的本班学生信息弹出层结束 -->



<!--jquery的js-->
<script type="text/javascript"
        th:src="@{/libs/jquery/jquery-3.5.1.js}"></script>
<!--引入自己的JS代码-->
<script type="text/javascript"
        th:src="@{/js/student/clist.js}"></script>

</body>
</html>
